import React from 'react'
import { useEffect } from 'react';
import { useState } from 'react';
/* 
  如果state的值是一个引用类型值,我们仍然不能直接修改这个值,而是通过set
  xxx的方式覆盖原有的值

*/

export default function App() {
  const [Person, setPerson] = useState([
    { id: "001", name: "我是老六" },
    { id: "002", name: "我是老八" },
    { id: "003", name: "我是六舅" },
  ]);


  //添加数据函数
  const stePersonHandle = () => {
    setPerson([...Person, { id: Date.now(), name: 666 }])
  }


  useEffect(() => {
    console.log("Person改变了");
  },[Person])

  return (
    <div>
      <button onClick={stePersonHandle}>添加数据</button>
      <ul>
        {
          Person.map(item => {
            return <li key={item.id}>{item.name}</li>
          })
        }
      </ul>
    </div>
  );
}


